<template>
  <a-layout-sider width="200px" :collapsible="collapsible" v-model="collapsed" :trigger="null">
    <logo :logo="logo" :title="title" />
    <s-menu :collapsed="collapsed" :menu="menus"></s-menu>
  </a-layout-sider>
</template>

<script>
import ALayoutSider from 'ant-design-vue/es/layout/Sider'
import Logo from '@/components/tools/Logo'
import SMenu from './menu'
import { mapGetters } from 'vuex'
export default {
  name: 'SideMenu',
  components: { ALayoutSider, Logo, SMenu },
  data () {
    return {
      logo: '',
      title: '',
      fixSiderbar: true
    }
  },
  props: {
    mode: {
      type: String,
      required: false,
      default: 'inline'
    },
    collapsible: {
      type: Boolean,
      required: false,
      default: false
    },
    collapsed: {
      type: Boolean,
      required: false,
      default: false
    },
    menus: {
      type: Array,
      required: true
    }
  },
  created () {
    let uniqueInfo = this.uniqueInfo
    if (uniqueInfo && uniqueInfo.logo) {
      this.logo = uniqueInfo.logo
    }
    if (uniqueInfo && uniqueInfo.systemTitle) {
      this.title = uniqueInfo.systemTitle
    }
  },
  computed: {
    ...mapGetters(['uniqueInfo'])
  },
  methods: {
  }
}
</script>
<style lang="less" scoped>

</style>
